
<section class="box" style="margin-top: 9px;">
  <header class="panel_header">
  <h2 class="title pull-left">{{'店铺品牌销售占比'|translate}}</h2>
  </header>
  <div class="content-body">
    <div echarts [loading]="vm.loading" [data]="vm.data" [type]="vm.type" [column]="vm.column" class="chart-container" style="height: 406px;"></div>
  </div>
</section>



<div style="position: relative;" class="mt10">
  <mat-card>
    <mat-card-title class="clearfix">
      {{'所有品牌'|translate}}
      <div class="right">
        <a mat-raised-button color="primary" (click)="export()">{{'下载'|translate}}</a>
      </div>
    </mat-card-title>
    <div class="divider"></div>

    <ngx-busy [busy]="offEvent2"></ngx-busy>
    <table class="responsive-table bordered highlight" >
      <thead>
        <tr >
          <th *ngFor="let column of columns;let $index = index" st-sort [st-sort]="column" [st-sort-data]="param" (sortChanged)="sortChanged($event)"  [innerHTML]="column.title|translate"> </th>
        </tr>
      </thead>
      <tbody>
        <tr *ngFor="let brand of allBrandsList | paginate: { itemsPerPage: 10, currentPage: p,totalItems: allBrandsList.length,id:'shop_detail_brand_table' };let $index = index;">
          <td>{{brand.date | dateFormat}}</td>
          <td>{{brand.brandName}}</td>
          <td>{{brand.sellAmount | number:'1.0-0'}}</td>
          <td><span class="tm-yen">¥</span>{{brand.sellMoney | number:'1.0-2'}}</td>
          <td>{{brand.monthSellAmount | number:'1.0-0'}}</td>
          <td><span class="tm-yen">¥</span>{{brand.monthSellMoney | number:'1.0-2'}}</td>
          <td>{{brand.productNum | number:'1.0-0'}}</td>
        </tr>
        <tr *ngIf="allBrandsList.length ==0">
          <td colspan="10" class="center-align">{{'暂无数据'|translate}}</td>
        </tr>
      </tbody>
    </table>
    <pagination-controls class="center-align pt20" id="shop_detail_brand_table" (pageChange)="p = $event" maxSize="9" directionLinks="true">
    </pagination-controls>

  </mat-card>
</div>

